<!DOCTYPE html> 
<html>
  <head>
    <!--META-->
    <meta charset="utf-8">
    <meta name="format-detection" content="telephone=no" />
    <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" />
    <meta name="msapplication-tap-highlight" content="no" />
    <meta http-equiv="X-UA-Compatible" content="IE=Edge">

    <!--CSS-->
    <link rel="stylesheet" href="API/css/themes/default/jquery.mobile.min.css" />
    <link rel="stylesheet" href="API/css/mycss.css" />
    <link rel="stylesheet" href="css/mycss.css" />

    <!--JS-->
    <script type="text/javascript" src="include/config.js"></script>
    <script type="text/javascript" src="API/js/Jquery/jquery.min.js"></script>
    <script type="text/javascript" src="API/js/JqueryMobile/jquery.mobile.min.js"></script>
    <script type="text/javascript" src="API/js/functionsLib.js"></script>
	
    <script language="javascript" type="text/javascript">
    ///////////////////
    //BLOCK VARIABLE GLOBAL
    ///////////////////
    var g_tab_testInput = new Array(); 
    g_tab_testInput["input_log"]=false; 
    g_tab_testInput["input_pass"]=false; 
    var g_couleurFontBon = "#04B404";
    var g_couleurFontMauvais = "#FF0000";
    var g_couleurFontDefaut = "#333333";
    var g_couleurFontTips = "#a1a1a1";

    ///////////////////
    //BLOCK FONCTIONS EVENEMENTS
    ///////////////////
    //Fin chargement page
    function OnLoad() {
        try {
            redirIflogged();
            chargerSiteLabel();
        } catch (er) {
            $.functionsLib.log(0, "ERROR(OnLoad):" + er.message);
        }
    }
    
    /**
     * ecoute
     */
    function ecoute(p_obj, p_eventCode) {
        try {
            switch (p_eventCode) 
            { 
                case 13: 
                    onblurInput(p_obj);
                    letMeIn();
                    break; 
                default: 
                    break; 
            }
            return true;
       } catch (er) {
            $.functionsLib.log(0, "ERROR(ecoute):" + er.message);
            return false;
        }
    }

    /**
     * onblurInput
     */
    function onblurInput(p_obj) {
        try {
            $("#tips_"+p_obj.name).text("");
            
            switch (p_obj.name) 
            {
                case "input_log" : 
                    var Model=/^[a-zA-Z]{2,}$/g;
                    var test = p_obj.value.match(Model);
                    if(test != null){
                        $("#label_"+p_obj.name).css("color", g_couleurFontBon);
                        g_tab_testInput[p_obj.name]=true;
                    }else{
                        $("#label_"+p_obj.name).css("color", g_couleurFontMauvais);
                        g_tab_testInput[p_obj.name]=false;
                    }
                    break;
                case "input_pass" : 
                    var Model=/^[a-zA-Z0-9]{2,}$/g;
                    var test = p_obj.value.match(Model);
                    if(test != null){
                        $("#label_"+p_obj.name).css("color", g_couleurFontBon);
                        g_tab_testInput[p_obj.name]=true;
                    }else{
                        $("#label_"+p_obj.name).css("color", g_couleurFontMauvais);
                        g_tab_testInput[p_obj.name]=false;
                    }
                    break;
                default: 
                    break; 
            }
            
            return true;
       } catch (er) {
            $.functionsLib.log(0, "ERROR(onblurInput):" + er.message);
            return false;
        }
    }

    /**
     * onfocusInput
     */
    function onfocusInput(p_obj) {
        try {
            $("#label_"+p_obj.name).css("color", g_couleurFontDefaut);
            $("#tips_"+p_obj.name).css("color", g_couleurFontTips);
            $("#id_msg").text("");

            switch (p_obj.name) 
            {
                case "input_log" :
                    $("#tips_"+p_obj.name).html("Que des caract&egrave;res et &agrave; minima de deux lettres.");
                    break;
                case "input_pass" : 
                    $("#tips_"+p_obj.name).html("Pas de caract&egrave;res sp&eacute;ciaux.");
                    break;
                default: 
                    break; 
            }
            
            return true;
       } catch (er) {
            $.functionsLib.log(0, "ERROR(onfocusInput):" + er.message);
            return false;
        }
    }

    ///////////////////
    //BLOCK FONCTIONS METIER
    ///////////////////
    /**
     * chargerSiteLabel
     */
    function chargerSiteLabel(){
        try {
            var siteLabel = $.functionsLib.getParameter("nom_site");
            $("#label_site_label").html("<center><h1>"+siteLabel+"</h1></center>");
        } catch (er) {
            $.functionsLib.log(0, "ERROR(chargerSiteLabel):" + er.message);
        }
    }
    
    /**
     * letMeIn
     */
    function letMeIn() {
        try {
            var p_input_log = $("#input_log").val();
            var p_input_pass = $("#input_pass").val();
            
            var retour_login = $.functionsLib.login(p_input_log, p_input_pass, "index.html");
            
            if(retour_login.statut == "ok"){
                window.location = "./page_home.html?mili="+$.functionsLib.getMilise();
            }else{
                $.functionsLib.notification("Erreur d'authentification.("+retour_login.message+")",$.functionsLib.oda_msg_color.WARNING);
            }
        } catch (er) {
            $.functionsLib.log(0, "ERROR(letMeIn):" + er.message);
        }
    }
    
    /**
     * redirIflogged
     */
    function redirIflogged() {
        try {
            var strAuthName = "";
            strAuthName = $.functionsLib.getCookie("auth");
            if (strAuthName != "") {
                window.location = "./page_home.html?mili="+$.functionsLib.getMilise();
            }
        } catch (er) {
            $.functionsLib.log(0, "ERROR(redirIflogged):" + er.message);
        }
    }
		
    </script>
  </head>
  <body onload="OnLoad();">
    <!-- page -->
    <div data-role="page">

        <!-- header -->
        <div data-role="header" data-position="fixed">
            <h1>L'Accueil</h1>
            <a href="javascript:window.location = ('./api_page_contact_restreint.html?mili='+$.functionsLib.getMilise());" data-role="button" data-icon="info" data-iconpos="notext">Contact</a>
        </div>
        <!-- /header -->

        <!-- content -->
        <div data-role="content" id="main_content">
            
            <label id="label_site_label"></label>

            <div data-role="collapsible" data-collapsed="false" data-mini="true" id="div_form">
                <h4>Authentification</h4>
                <label id="id_msg"></label>
                <form action="" method="post" name="form" id="form">
                    <div data-role="fieldcontain">
                        <label for="input_log" id="label_input_log">Identifiant :</label><br>
                        <input type="text" name="input_log" id="input_log" value="" data-mini="true" placeholder="votre identifiant" onkeyup="ecoute(this, event.keyCode);" onblur="onblurInput(this);" onfocus="onfocusInput(this);" />
                        <label for="input_log" id="tips_input_log" style="width: 75%"></label><br>
                    </div>
                    <div data-role="fieldcontain">
                        <label for="input_pass" id="label_input_pass">Mot de passe  :</label><br>
                        <input type="password" name="input_pass" id="input_pass" value="" data-mini="true" placeholder="Votre mot de passe" onkeyup="ecoute(this, event.keyCode);" onblur="onblurInput(this);" onfocus="onfocusInput(this);" />
                        <label for="input_pass" id="tips_input_pass" style="width: 75%"></label><br>
                    </div>		
                    <a href="javascript:letMeIn();" data-role="button" data-inline="true" data-icon="arrow-r" data-mini="true" id="submit">Soumettre</a>					
                    <a href="javascript:window.location = ('./api_page_creercompte.html?mili='+$.functionsLib.getMilise());" data-role="button" data-inline="true" data-icon="arrow-r" data-mini="true" id="creercompte">Cr&eacute;er un compte</a>
                    <a href="javascript:window.location = ('./api_page_accesperdu.html?mili='+$.functionsLib.getMilise());" data-role="button" data-inline="true" data-icon="arrow-r" data-mini="true" id="accesperdu">Acc&egrave;s perdu ?</a>
                </form>
            </div>
        </div>
        <!-- /content -->

        <!-- footer -->
        <div data-role="footer" data-position="fixed">
                <h1>Bienvenue</h1>
        </div>
        <!-- /footer -->

    </div>
    <!-- /page -->
</body>
</html>